<template>

  <div>
    <el-form :inline="true" :model="form" class="custom-left-form">
      <el-form-item class="custom-label-item">
        <template slot="label">
          <span style="color: red; font-size: 25px; margin-right: 4px;">谨慎操作::</span>
          <span style="font-size: 20px;" >医院机构</span>
        </template>

        <el-select v-model="queryParams.ID_ORG" placeholder="请选择机构" style="width: 200px">
          <el-option v-for="item in provinceOptions" :key="item.ID_ORG" :label="item.NA" :value="item.ID_ORG"/>
        </el-select>
      </el-form-item>

      <el-form-item>
        <el-input v-model="queryParams.invoiceNumber" placeholder="请输入发票号码"></el-input>
      </el-form-item>

      <el-form-item>
        <el-button type="success" @click="queryInvoiceById()">发票查询</el-button>
      </el-form-item>

    </el-form>

    <el-table :data="tableData" style="width: 100%" :fit="true">

      <el-table-column fixed prop="SCRQ" label="上传日期"></el-table-column>
      <el-table-column prop="BRXM" label="姓名"></el-table-column>
      <el-table-column prop="YWLX" label="业务类型"></el-table-column>
      <el-table-column prop="JE" label="金额"></el-table-column>
      <el-table-column prop="FPHM" label="发票号码"></el-table-column>
      <el-table-column prop="DZPJDM" label="电子票据代码"></el-table-column>
      <el-table-column prop="DZPJHM" label="电子票据号码"></el-table-column>
      <el-table-column prop="DZJYM" label="电子校验码"></el-table-column>
      <!--      <el-table-column prop="DZPJWWYM" label="电子票据外网页面" class-name="nowrap-column"></el-table-column>-->
      <el-table-column prop="DZPJWWYM" label="电子票据页面(点击地址打开)" class-name="nowrap-column" min-width="200">
        <template slot-scope="scope">
          <el-tooltip class="item" effect="dark" :content="scope.row.DZPJWWYM" placement="top">
            <a :href="scope.row.DZPJWWYM" target="_blank" class="safe-link" style="font-size: 18px;color: crimson">
              <span class="ellipsis-text">{{ scope.row.DZPJWWYM }}</span>
            </a>
          </el-tooltip>
        </template>
      </el-table-column>

      <el-table-column prop="PJZT" label="票据状态"></el-table-column>

      <el-table-column fixed="right" label="操作">
        <template slot-scope="scope">

          <el-tooltip :content="scope.row.PJZT_CODE === '-1' ? '可开票' : '发票已开禁止操作'" placement="top">
            <el-button type="text"
                       :style="{color: scope.row.PJZT_CODE === '-1'?'#67C23A':'#F56C6C',cursor: scope.row.PJZT_CODE === '-1' ? 'pointer' : 'not-allowed'}"
                       :disabled="scope.row.PJZT_CODE !== '-1'"
                       @click="scope.row.PJZT_CODE === '-1' && BS_E_TicketsInvoicing(scope.row)">开票
            </el-button>
          </el-tooltip>
          <!-- 冲红按钮（PJZT=0时红色不可点击） -->
          <el-tooltip :content="scope.row.PJZT_CODE === '2' ? '发票已冲红禁止操作' : '可冲红'" placement="top">
            <el-button type="text"
                       :style="{color: scope.row.PJZT_CODE === '2' ? '#F56C6C':'#67C23A',cursor: scope.row.PJZT_CODE === '2' ? 'not-allowed' : 'pointer'}"
                       :disabled="scope.row.PJZT_CODE === '2'"
                       @click="scope.row.PJZT_CODE !== '2' && BS_E_TicketsFlushRed(scope.row)">冲红
            </el-button>
          </el-tooltip>

          <el-tooltip :content="scope.row.PJZT_CODE === '2' ? '可补打' : '请先冲红原来发票'" placement="top">
            <el-button type="text"
                       :style="{color: scope.row.PJZT_CODE === '2' ? '#67C23A':'#F56C6C',cursor: scope.row.PJZT_CODE === '2' ?  'pointer': 'not-allowed'}"
                       :disabled="scope.row.PJZT_CODE !== '2'"
                       @click="scope.row.PJZT_CODE == '2' && BS_E_TicketsInvoicingReHit(scope.row)">补打
            </el-button>
          </el-tooltip>

        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import {queryHospitalList, queryInvoiceById, BS_E_TicketsInvoicing, BS_E_TicketsFlushRed} from "@/views/dzfp/dzfp";

export default {

  methods: {
    provinceOptionsmeth() {
      queryHospitalList().then(response => {
        if (response.code == 200) {
          this.provinceOptions = response.data;
        }
        // 设置默认选中第一个选项
        if (this.provinceOptions.length > 0) {
          this.queryParams.ID_ORG = this.provinceOptions[0].ID_ORG;
        }
      });
    },
    queryInvoiceById() {
      queryInvoiceById(this.queryParams).then(response => {
        if (response.code == 200) {
          this.tableData = response.data;
        }
      });
    },

    BS_E_TicketsInvoicingReHit(data){
      this.data.invoiceNumber = data.FPHM;
      this.data.euDirect = '1';
      this.data.jgid = data.OrgId;
      this.data.medstoeid = data.idMedstCg;
      this.data.reHitFlag = '1'; // 0 新开 1 补打
      BS_E_TicketsInvoicing(this.data).then(response => {
        if (response.code == 200) {
          this.queryParams.ID_ORG = response.data.JGID;
          this.queryParams.invoiceNumber = response.data.YYFPHM;
          this.queryInvoiceById(this.queryParams);
        } else {
          // 弹窗提示错误信息
          this.$message({
            message: response.msg || '操作失败，请重试', // 优先显示接口返回的错误信息
            type: 'error',
            duration: 3000,
            showClose: true
          });
        }
      }).catch(error => {
        // 网络错误等异常处理
        this.$message.error('电子发票开票异常!' || error);
      });
    },
    BS_E_TicketsInvoicing(data) {
      this.data.invoiceNumber = data.FPHM;
      this.data.euDirect = '1';
      this.data.jgid = data.OrgId;
      this.data.medstoeid = data.idMedstCg;
      this.data.reHitFlag = '0' // 0 新开 1 补打
      BS_E_TicketsInvoicing(this.data).then(response => {
        if (response.code == 200) {
          this.queryParams.ID_ORG = response.data.JGID;
          this.queryParams.invoiceNumber = response.data.YYFPHM;
          this.queryInvoiceById(this.queryParams);
        } else {
          // 弹窗提示错误信息
          this.$message({
            message: response.msg || '操作失败，请重试', // 优先显示接口返回的错误信息
            type: 'error',
            duration: 3000,
            showClose: true
          });
        }
      }).catch(error => {
        // 网络错误等异常处理
        this.$message.error('电子发票开票异常!' || error);
      });
    },
    BS_E_TicketsFlushRed(data) {
      this.data.invoiceNumber = data.FPHM;
      this.data.euDirect = '-1';
      this.data.jgid = data.OrgId;
      this.data.medstoeid = data.idMedstCg;

      BS_E_TicketsFlushRed(this.data).then(response => {
        if (response.code == 200) {
          this.queryParams.ID_ORG = response.data.JGID;
          this.queryParams.invoiceNumber = response.data.YYFPHM;
          this.queryInvoiceById(this.queryParams);
        }
      }).catch(error => {
        // 网络错误等异常处理
        this.$message.error('电子发票冲红异常!' || error);
      });
    }
  },
  created() {
    this.provinceOptionsmeth() // 初始化加载jgid
  },
  data() {
    return {
      data: {rowList: ''},
      queryParams: {ID_ORG: ''},
      input: '',
      provinceOptions: [],
      jigd: '',
      form: {},
      tableData: []
    }
  }
}
</script>

<style scoped>

/* 核心左对齐样式 */
.custom-left-form {
  display: flex;
  flex-wrap: wrap;
  align-items: left;
}

::v-deep .custom-label-item {
  font-size: var(--label-font-size, 20px) !important;
  color: var(--label-color, red) !important; /* 默认颜色 */
  /* font-weight: var(--label-weight, normal);*/
}

::v-deep .ellipsis-text {
  display: inline-block;
  max-width: 80%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}


/* 基础表格样式 */
::v-deep .el-table {
  border: 1px solid #000 !important;
  border-color: #000 !important; /* 表格外边框 */
}

/* 单元格边框设置 */
::v-deep .el-table td,
::v-deep .el-table th {
  border: 1px solid #000 !important;
  border-color: #000 !important; /* 单元格边框 */
}

/* 表头专属样式 */
::v-deep .el-table th {
  font-weight: 900 !important; /* 数字加粗级别（比bold更粗） */
  color: #000 !important; /* 表头文字颜色 */
  background-color: #f5f7fa !important; /* 保留默认背景色 */
}


</style>